<template>
  <div class="storeHistoryData">
    <CommonBtn label-name="原始门店信息查询<span style='color:red'>【此功能菜单仅做门店信息查询】</span>" v-if="!button || (button.event!='add()' && button.event!='edit()') " :buttons="buttons" @onButtonClick="onButtonClick">
      <span slot="conditions" v-for="(item,index) of conditions" :key="index" v-if="item.checked">{{item.label+":"+item.value}}</span>
      <el-form slot="appendCondition" :inline="true" style="display:inline-block" class="time-query">
        <el-form-item>
          <el-date-picker
            type="month"
            format="yyyy-M" value-format="yyyy-M"
            placeholder="选择日期" @change="conditionsChange($event)" v-model="date"></el-date-picker>
        </el-form-item>
        <el-button type="primary" @click="onSubmit">查询</el-button>
      </el-form>
    </CommonBtn>
    <CommonList ref="list" v-if="!button || (button.event!='add()' && button.event!='edit()')" :buttons="buttons"
                :columns="columns" :listUrl="listUrl" @tableSelect="tableSelect" :conditions="conditions"></CommonList>
    <search-pop-up :out-btn="button"
                   :props="columns" @close="close"
                   :out-conditions="conditions"
                   @conditionChange="conditionChange"></search-pop-up>
    <CommonExport :out-btn="button" :props="columns"
                  @close="close" :export-url="$api.API_RETAILERHISTORY_EXPORT" :conditions="conditions"></CommonExport>
  </div>
</template>

<script>
    import CommonList from "../../common/CommonList";
    import CommonBtn from "../../common/CommonBtn";
    import CommonEdit from "../../common/CommonEdit";
    import SearchPopUp from "../../common/SearchPopUp";
    import CommonExport from "../../common/CommonExport";


    export default {
        name:'storeHistoryData',
        data(){
            return{
                buttons:[
                    this.$config.BTNS.EXPORT,
                ],
                columns:[
                    {
                        prop:'mdmCode',
                        label:'统一编码'
                    },
                    {
                        prop:'code',
                        label:'外部系统编码'
                    },
                    {
                        prop:'retailName',
                        label:'门店名称'
                    },
                    {
                        prop:'levelName',
                        label:'门店投资属性'
                    },
                    {
                        prop:'wfStatus',
                        label:'节点状态'
                    },
                    {
                        prop:'dataSource',
                        label:'数据来源'
                    },
                    {
                        prop:'retailGroup',
                        label:'所属集团客户'
                    },
                    {
                        prop:'retailType',
                        label:'门店类型'
                    },
                    {
                        prop:'provinceName',
                        label:'省'
                    },
                    {
                        prop:'cityName',
                        label:'市'
                    },
                    {
                        prop:'adminCity',
                        label:'区县'
                    },
                    {
                        prop:'address',
                        label:'街道'
                    },
                    {
                        prop:'address1',
                        label:'路'
                    },
                    {
                        prop:'address2',
                        label:'地址'
                    },
                    {
                        prop:'repName',
                        label:'负责人'
                    },
                    {
                        prop:'createTime',
                        label:'创建时间'
                    },
                    {
                        prop:'modifyTime',
                        label:'最后修改时间'
                    }
                ],
                listUrl: '',
                button:null,
                conditions:[],
                row:{},
                date:''
            }
        },
        methods:{
            onButtonClick(item) {
                if (item.event == 'edit()') {
                    if (!this.row || JSON.stringify(this.row) == '{}') {
                        this.$message.error("请选择一行数据")
                        return
                    }
                }
                if (item.event == 'add()') {
                    this.row = {}
                }

                this.button = item
            },
            tableSelect(row) {
                this.row = row
            },
            conditionChange(conditions) {
              if (this.listUrl) {
                this.$refs.list.search()
              } else {
                this.listUrl = this.$api.API_SELECT_RETAILERHISTORY_LIST
              }
            },
            close(item) {
                this.button = item
            },
            onSubmit() {
              if (this.listUrl) {
                this.$refs.list.search()
              } else {
                this.listUrl = this.$api.API_SELECT_RETAILERHISTORY_LIST
              }
            },
            conditionsChange(e) {
              if (!this.listUrl) {
                this.listUrl = this.$api.API_SELECT_RETAILERHISTORY_LIST
              }
                this.conditions = []
                if (e) {
                    let time = e.split('-')
                    this.conditions.push({prop:'year',value:time[0],checked:true,label:'年'})
                    this.conditions.push({prop:'month',value:time[1],checked:true,label:'月'})
                }
            },
        },
        components:{CommonExport,SearchPopUp, CommonList,CommonBtn,CommonEdit,},
    }
</script>

<style lang="less" scoped>
  .time-query{
    /deep/.el-input__inner{
      height: 30px;
    }
    /deep/.el-form-item__content{
      line-height: unset;
    }
  }

  /deep/.el-button{
    display: inline-flex;
    text-decoration: none;
    align-items: center;
    vertical-align: center;
    font: 8px/8px HelveticaNeue, Arial;
    padding: 0px 11px;
    border: 1px solid #FFF;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    cursor: pointer;
    font-size: 9pt;
    margin-left: 2px;
    line-height: 25px;
    color: #000;
    outline: none;
    background-image: url(../../../assets/img/datagrid_header_bg.gif);
    background-repeat: repeat-x;
    border: 1px solid #ccc;
    &:hover {
      color: #FFF;
      filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#33bbee', endColorstr='#2288cc');
      border: 1px solid #d51900;
      background: linear-gradient(top, #d51900, #d51900);
      background: -moz-linear-gradient(top, #d51900, #d51900);
      background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#d51900), to(#d51900));
      text-shadow: -1px -1px 1px #1c6a9e;
    }
    /deep/span{
      display: block;
    }
  }
</style>
